{layout name="layout2" /}
<style>
    .div-flex {
        display: flex;
        align-items: center;
        justify-content: left;
    }

    .width-160 {
        width: 200px;
    }

    .layui-table th {
        text-align: center;
    }

    .table-margin {
        margin-left: 50px;
        margin-right: 50px;
        text-align: center;
    }

    .image {
        height: 80px;
        width: 80px;
    }

    .mt50 {
        margin-left: 50px;
    }

</style>

<div class="layui-card-body">
    <!--基本信息-->
    <div class="layui-form" lay-filter="layuiadmin-form-order" id="layuiadmin-form-order">
        <input type="hidden" class="order_id" name="order_id" value="{$detail.id}">

        <div class="layui-form-item">
            <fieldset class="layui-elem-field layui-field-title">
                <legend>订单信息</legend>
            </fieldset>
        </div>

        <div class="layui-form-item div-flex">
            <label class="layui-form-label ">订单编号:</label>
            <div class="width-160">{$detail.order_sn}</div>
            <label class="layui-form-label ">订单类型:</label>
            <div class="width-160">{$detail.order_type_text}</div>
            <label class="layui-form-label ">下单时间:</label>
            <div class="width-160">{$detail.create_time}</div>
        </div>

        <div class="layui-form-item div-flex">
            <label class="layui-form-label">订单状态:</label>
            <div class="width-160">
                <div class=" layui-btn layui-btn-primary layui-border-blue layui-btn-sm">{$detail.order_status_text}</div>
                <input id="old_status" type="hidden" value="{$detail.order_status}">
            </div>
            <label class="layui-form-label ">档期:</label>
            <div class="width-160">{$detail.schedule}</div>
        </div>

        <div class="layui-form-item">
            <fieldset class="layui-elem-field layui-field-title">
                <legend>提单人信息</legend>
            </fieldset>
        </div>

        <div class="layui-form-item div-flex">
            <label class="layui-form-label ">角色:</label>
            <div class="width-160">主播</div>
            <label class="layui-form-label ">姓名:</label>
            <div class="width-160">
                {$detail.the_host.true_name}
            </div>
            <label class="layui-form-label ">手机号码:</label>
            <div class="width-160">
                {$detail.the_host.tel_number}
            </div>
            <label class="layui-form-label ">微信号:</label>
            <div class="width-160">{$detail.the_host.wx_code}</div>
        </div>

        <div class="layui-form-item div-flex">
            <label class="layui-form-label ">注册时间:</label>
            <div class="width-160">{$detail.the_host.create_time}
            </div>
        </div>

        <div class="layui-form-item">
            <fieldset class="layui-elem-field layui-field-title">
                <legend>对方信息</legend>
            </fieldset>
        </div>

        <div class="layui-form-item div-flex">
            <label class="layui-form-label ">角色:</label>
            <div class="width-160">商户</div>
            <label class="layui-form-label ">名称:</label>
            <div class="width-160">
                {$detail.supplier.store_name}
            </div>
            <label class="layui-form-label ">手机号码:</label>
            <div class="width-160">
                {$detail.supplier.tel_number}
            </div>
            <label class="layui-form-label ">微信号:</label>
            <div class="width-160">{$detail.supplier.wx_code}</div>
        </div>

        <div class="layui-form-item div-flex">
            <label class="layui-form-label ">注册时间:</label>
            <div class="width-160">{$detail.supplier.create_time}
            </div>
        </div>
        <div class="layui-form-item">
            <fieldset class="layui-elem-field layui-field-title">
                <legend>订单操作</legend>
            </fieldset>
        </div>

        <div class="layui-form-item div-flex ">
            <div class="layui-input-block ">
                <!--@todo-->

                {if condition="$detail.order_status==1 && !isset($role_id)"}
                <button type="submit" class="layui-btn layui-btn-sm width_160 " id="pass">通过申请
                </button>
                <button type="submit" class="layui-btn layui-btn-sm layui-btn-warm width_160 " id="refuse">拒绝申请
                </button>

                {/if}
                {in name="$detail.order_status" value="[0,1,2]"}
                {notempty name="$role_id"}
                <button type="submit" class="layui-btn layui-btn-sm layui-btn-danger width_160 " id="cancel">取消订单
                </button>
                {/notempty}
                {/in}

                {if condition="($detail.order_status == 6) && ($detail.del == 0)" }
                <button type="submit" class="layui-btn layui-btn-sm layui-btn-danger width_160 " id="del">删除订单</button>
                {/if}
                <button type="button" class="layui-btn layui-btn-sm layui-btn-primary width_160 " id="back">返回</button>
            </div>
        </div>

        <div class="layui-form-item">
            <fieldset class="layui-elem-field layui-field-title">
                <legend>商品信息</legend>
            </fieldset>
        </div>

        <div class="layui-form-item table-margin">
            <table class="layui-table">
                <colgroup>
                    <col>
                    <col>
                </colgroup>
                <thead>
                <tr>
                    <th>商品信息</th>
                    <th>佣金</th>
                    <th>价格(元)</th>
                    <th>优惠券(元)</th>
                </tr>
                </thead>
                <tbody>
                {foreach $detail.order_goods as $k => $goods}
                <tr>
                    <td>
                        <div style="text-align: left">
                            <div class="layui-col-md3">
                                <img src="{$goods.image}" class="image-show image" >
                            </div>
                            <div class="layui-col-md9">
                                <a href="{$goods.goods_links}"><p style="margin-top: 10px;">{$goods.goods_name}</p></a>
                                <br>
                                <p	class="layui-btn layui-btn-xs layui-btn-disabled">{$goods.platform == 1 ? "抖音" : ($goods.platform == 2 ? "快手" : "天猫")}</p>
                                <p 	class="layui-btn layui-btn-xs layui-btn-primary layui-border-black">{$goods.welfare}</p>

                            </div>
                        </div>
                    </td>
                    <td>{$goods.commission}%</td>
                    <td>￥{$goods.goods_price}</td>
                    <td>{$goods.coupon}</td>

                </tr>
                {/foreach}
                <tr>
                    <td></td>
                    <td></td>
                    <td></td>
                    <td style="text-align: right">
                        <p>商品金额:￥{$detail.total_price}</p>
                    </td>
                </tr>
                </tbody>
            </table>
        </div>

        <div class="layui-form-item">
            <fieldset class="layui-elem-field layui-field-title">
                <legend>买家留言</legend>
            </fieldset>
        </div>

        <div class="layui-form-item table-margin">
            <textarea class="layui-textarea" disabled>{$detail.user_remark}</textarea>
        </div>


        <div class="layui-form-item">
            <fieldset class="layui-elem-field layui-field-title">
                <legend>订单日志</legend>
            </fieldset>
        </div>

        <div class="layui-form-item table-margin">
            <table class="layui-table">
                <colgroup>
                    <col width="100">
                    <col width="100">
                    <col width="250">
                </colgroup>
                <thead>
                <tr>
                    <th>日期</th>
                    <th>动作类型</th>
                    <th>日志内容</th>
                </tr>
                </thead>
                <tbody>
                {empty name= "$logs"}
                <tr>
                    <td colspan="3">暂无记录</td>
                </tr>
                {else/}
                {foreach $logs as $k => $log}
                <tr>
                    <td>{$log.create_time}</td>
                    <td>{$log.channel}</td>
                    <td>{$log.content}</td>
                </tr>
                {/foreach}
                {/empty}
                </tbody>
            </table>
        </div>


    </div>
</div>

<script type="text/javascript">
    //注意：选项卡 依赖 element 模块，否则无法进行功能性操作

    layui.config({
        version: "{$front_version}",
        base: '/static/plug/layui-admin/dist/layuiadmin/' //静态资源所在路径
    }).extend({
        index: 'lib/index' //主入口模块
    }).use(['index', 'element', 'jquery', 'like'], function () {
        var $ = layui.$;
        var like = layui.like;

        //主图放大
        $(document).on('click', '.image-show', function () {
            var src = $(this).attr('src');
            like.showImg(src, 600);
        });


        $('#back').click(function () {
            var index = parent.layer.getFrameIndex(window.name); //获取当前窗口的name
            parent.layer.close(index);
            parent.layui.table.reload('order-lists');
            return true;
        });

        //取消订单
        $('#cancel').click(function () {
            var order_id = $('.order_id').val();
            layer.confirm('确认取消订单吗?', {
                btn: ['确认', '取消'] //按钮
            }, function () {
                like.ajax({
                    url: '{:url("order/cancel")}'
                    , data: {'order_id': order_id}
                    , type: 'post'
                    , success: function (res) {
                        if (res.code == 1) {
                            layui.layer.msg(res.msg, {
                                offset: '15px'
                                , icon: 1
                                , time: 1000
                            }, function () {
                                location.reload();
                            });
                        }
                    }
                });
            });
        });


        //删除订单
        $('#del').click(function () {
            var order_id = $('.order_id').val();
            layer.confirm('删除后订单将消失，确认删除订单吗?', {
                btn: ['确认', '取消'] //按钮
            }, function () {
                like.ajax({
                    url: '{:url("order/del")}'
                    , data: {'order_id': order_id}
                    , type: 'post'
                    , success: function (res) {
                        if (res.code == 1) {
                            layui.layer.msg(res.msg, {
                                offset: '15px'
                                , icon: 1
                                , time: 1000
                            }, function () {
                                location.reload();
                            });
                        }
                    }
                });
            });
        });
        // 通过审核
        $("#pass").click(function () {
            var order_id = $('.order_id').val();
            {if condition = "!isset($role_id)"}
            var order_status = 0;
            {elseif condition = "$role_id && $detail.order_status==0"}
            var order_status = 2;
            {elseif condition = "$role_id==1 && $detail.order_status==2"}
            var order_status = 3;
            {/else}
             {/if}
                 var old_status = $("#old_status").val();

                 layer.confirm('要通过该订单申请吗?', {
                        btn: ['确认', '取消'] //按钮
                    }, function () {
                        like.ajax({
                            url: '{:url("order/audit")}'
                            , data: {'order_id': order_id, order_status: order_status,old_status:old_status}
                            , type: 'post'
                            , success: function (res) {
                                if (res.code == 1) {
                                    layui.layer.msg(res.msg, {
                                        offset: '15px'
                                        , icon: 1
                                        , time: 1000
                                    }, function () {
                                        location.reload();
                                    });
                                }
                            }
                        });
                    });
                }
            );
        // 拒绝申请
        $("#refuse").click(function () {
            var order_id = $('.order_id').val();
            var order_status = 5;
            layer.confirm('要拒绝该订单申请吗?', {
                btn: ['确认', '取消'] //按钮
            }, function () {
                like.ajax({
                    url: '{:url("order/audit")}'
                    , data: {'order_id': order_id, order_status: order_status}
                    , type: 'post'
                    , success: function (res) {
                        if (res.code == 1) {
                            layui.layer.msg(res.msg, {
                                offset: '15px'
                                , icon: 1
                                , time: 1000
                            }, function () {
                                location.reload();
                            });
                        }
                    }
                });
            });
        })
    });
</script>